<!-- 这是待办任务、已办任务对话框中的按钮 
接收参数：



请选择下一步数组
选择下一步办理人数组
下一步选择框类型,用来控制单选还是多选
tabKey 用来区分是待办任务按钮还是已办任务按钮

-->
<template>
  <div>
    <a-select
      style="width: 180px"
      placeholder="请选择下一步"
      v-if="nextTaskarray.length == 0 || tabKey == 2 ? false : true"
      :loading="false"
      v-model="nextTask"
      :mode="nextStepType"
    >
      <a-select-option
        v-for="(item, index) in nextTaskarray"
        :key="index"
        :value="item"
        >{{ item }}</a-select-option
      >
    </a-select>

    <a-select
      placeholder="选择下一步办理人"
      v-if="nextTaskarray.length == 0 || tabKey == 2 ? false : true"
      style="margin-left: 30px; width: 180px"
      v-model="ASSIGNEE_"
      @change="onChange"
      :mode="nextStepType"
      showSearch
    >
      <a-select-option
        v-for="index in assigneeArray"
        :key="index.userId"
        :value="index.userName"
        >{{ index.userName }}</a-select-option
      >
    </a-select>
    <a-button
      style="margin-left: 30px"
      v-if="nextTaskarray.length == 0 || tabKey == 2 ? false : true"
      @click="checkHandle_ok"
      type="primary"
      >发送</a-button
    >

    <a-button
      style="margin-left: 30px"
      type="primary"
      @click="checkHandle_ok"
      v-if="nextTaskarray.length == 0 && tabKey == 1 ? true : false"
      >提交</a-button
    >

    <a-button
      style="margin-left: 30px"
      type="danger"
      @click="end_handle"
      v-if="tabKey == 2 ? false : true"
      >结束</a-button
    >

    <a-button
      type="primary"
      v-if="tabKey == 2 && duty_name == '结束' ? true : false"
      style="margin-left: 30px"
      >打印</a-button
    >

    <a-button
      style="margin-left: 30px"
      @click="close_modal"
      v-if="tabKey == 2 ? true : false"
      >关闭</a-button
    >
  </div>
</template>

<script>
export default {
  data() {
    // 根据当前任务节点来判断如何显示按钮
    return {
      nextTask: undefined, // 下一步任务
      ASSIGNEE_: undefined, // 下一步办理人
      singleFormData: new FormData(),
    };
  },
  props: {
    // 任务名称
    duty_name: {
      type: String,
      required: true,
    },
    // 用来区分是待办任务还是已办任务
    tabKey: {
      type: Number,
      required: true,
    },
    // 下一步任务数组
    nextTaskarray: {
      type: Array,
      required: true,
    },
    // 下一步办理人数组
    assigneeArray: {
      type: Array,
      required: true,
    },
    // 用来控制单选还是多选
    nextStepType: {
      type: String,
      required: true,
    },
  },

  methods: {
    // 下载文件使用
    downloadFile() {},

    // 发送按钮触发函数
    checkHandle_ok() {
      // console.log("选择的下一步办理人::::", this.ASSIGNEE_);
      if (this.assigneeArray.length > 0) {//下一步办理人
        if (typeof this.ASSIGNEE_ != "undefined") {//选中 的下一步办理人
          this.$emit("send-task", this.singleFormData);
        }
        else{
        this.$message.error("请选择下一步办理人!");
        }
        // console.log("下一步办理人数", this.ASSIGNEE_ );
      } else {
          this.$emit("send-task", this.singleFormData);
        // this.$message.error("已经到达最后一步!");
      }
    },

    // 结束按钮
    end_handle() {
      // 结束时不用选择下一步审批人
      this.$emit("end-task");
    },
    // 父组件对话框结束
    close_modal() {
      this.$emit("close-modal");
    },

    // 选择下一步办理人触发事件
    onChange(value, options) {
      this.singleFormData = new FormData();
      // console.log(value, options);
      if (typeof value == "string") {
        // 单选情况下，下一步办理人
        this.singleFormData.append("ASSIGNEE_", options.key);
      } else {
        // 多选情况下,下一步办理人
        for (let i = 0; i < options.length; i++) {
          this.singleFormData.append(
            "assignees" + String.fromCharCode(97 + i),
            options[i].key
          );
        }
      }
      // console.log("singleFormData::::", this.singleFormData.get("assigneesa"));
    },
  },
};
</script>

<style></style>
